<template>
  <div class="containter">
    <div class="step">
      <ol class="titt">
        <el-badge
          :value="item.num"
          :max="99"
          :hidden="item.num == 0"
          class="item"
          v-for="(item, index) in list"
          :key="index"
        >
          <el-button
            class="button"
            size="mini"
            :class="activeIndex == index?'cur':''"
            :disabled="item.num == 0"
            @click="goAssignBlock('panelRef'+ index,100,index)"
          >{{item.text}}</el-button>
        </el-badge>
      </ol>
    </div>
    <!-- 科技研发信息 -->
    <div
      ref="panelRef0"
      class="basicInfo basicInfo1"
    >
      <p class="title"><span>科技研发信息</span><span
          @click="checkMorekey"
          class="glqy"
        >查看更多信息>></span></p>
      <el-table
        :data="keyInfoData"
        style="width: 100%"
        v-loading='loading4'
        :header-cell-style="{background:'#f2f9fe'}"
      >
        <el-table-column
          type="index"
          label="序号"
          width="100"
          align="center"
        />
        <el-table-column
          prop="sfsygjjgxjsqy"
          label="是否属于国家级高新技术企业"
          align="center"
        />
        <!-- <el-table-column
          prop="zfzjzc"
          label="政府资金支持(万元)"
          align="center"
        >
          <template slot-scope="scope">
            <span v-show="isTm">{{deseHandler(scope.row.zfzjzc)}}</span>
            <span v-show="!isTm">{{scope.row.zfzjzc}}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="hdkyzcxx"
          label="获得科研支持信息"
          align="center"
        /> -->
      </el-table>
      <el-dialog
        title="查看更多科技研发信息"
        :visible.sync="dialogVisible4"
        width="50%"
        custom-class="dialog"
      >
        <el-table
          :data="keyInfoMoreData"
          style="width: 100%"
          :header-cell-style="{background:'#f2f9fe'}"
        >
          <el-table-column
            type="index"
            label="序号"
            width="100"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{(pagination4.page - 1) * 10 + scope.$index + 1}}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="sfsygjjgxjsqy"
            label="是否属于国家级高新技术企业"
            align="center"
          />
          <!-- <el-table-column
            prop="zfzjzc"
            label="政府资金支持(万元)"
            align="center"
          >
            <template slot-scope="scope">
              <span v-show="isTm">{{deseHandler(scope.row.zfzjzc)}}</span>
              <span v-show="!isTm">{{scope.row.zfzjzc}}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="hdkyzcxx"
            label="获得科研支持信息"
            align="center"
          /> -->
        </el-table>
        <div class="pagination"><el-pagination
            layout="prev, pager, next"
            background
            :current-page.sync='pagination4.page'
            :total="pagination4.total"
            @current-change='keyPagion'
          ></el-pagination></div>
      </el-dialog>
    </div>
    <div
      ref="panelRef1"
      class="basicInfo basicInfo1"
    >
      <p class="title"><span>专利信息</span><span
          @click="checkMorePatent"
          class="glqy"
        >查看更多信息>></span></p>
      <el-table
        :data="patentList"
        style="width: 100%"
        v-loading='loading1'
        :header-cell-style="{background:'#f2f9fe'}"
      >
        <el-table-column
          type="index"
          label="序号"
          width="100"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="fmmc"
          label="专利名称"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="zlh"
          label="专利号"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="zllx"
          label="专利类型"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="sqrq"
          label="申请日期"
          align="center"
        >
          <template slot-scope="{row}">
            <span>{{ row.sqrq ? row.sqrq.slice(0,10) : row.sqrq  }}</span>
          </template>
        </el-table-column>
        <!-- <el-table-column
          prop="zlnf"
          label="专利年份"
          align="center"
        ></el-table-column> -->
      </el-table>
      <el-dialog
        title="查看更多专利信息"
        :visible.sync="dialogVisible1"
        width="50%"
        custom-class="dialog"
      >
        <el-table
          :data="patentMoreList"
          style="width: 100%"
          :header-cell-style="{background:'#f2f9fe'}"
        >
          <el-table-column
            type="index"
            label="序号"
            width="100"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{(pagination1.page - 1) * 10 + scope.$index + 1}}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="fmmc"
            label="专利名称"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="zlh"
            label="专利号"
            align="center"
          ></el-table-column>
          <el-table-column
          prop="zllx"
          label="专利类型"
          align="center"
        ></el-table-column>
          <el-table-column
            prop="sqrq"
            label="申请日期"
            align="center"
          ></el-table-column>
          <!-- <el-table-column
            prop="zlnf"
            label="专利年份"
            align="center"
          ></el-table-column> -->
        </el-table>
        <div class="pagination"><el-pagination
            layout="prev, pager, next"
            background
            :current-page.sync='pagination1.page'
            :total="pagination1.total"
            @current-change='patent'
          ></el-pagination></div>
      </el-dialog>
    </div>
    <div
      ref="panelRef2"
      class="basicInfo basicInfo1"
    >
      <p class="title"><span>商标信息</span><span
          @click="checkMoreBrand"
          class="glqy"
        >查看更多信息>></span></p>
      <el-table
        :data="brandList"
        style="width: 100%"
        v-loading='loading2'
        :header-cell-style="{background:'#f2f9fe'}"
      >
        <el-table-column
          type="index"
          label="序号"
          width="100"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="sbmc"
          label="商标名称"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="zch"
          label="注册号"
          align="center"
        ></el-table-column>
        <!-- <el-table-column
          prop="curstatus"
          label="商标状态"
          align="center"
        ></el-table-column> -->
      </el-table>
      <el-dialog
        title="查看更多商标信息"
        :visible.sync="dialogVisible2"
        width="50%"
        custom-class="dialog"
      >
        <el-table
          :data="brandMoreList"
          style="width: 100%"
          :header-cell-style="{background:'#f2f9fe'}"
        >
          <el-table-column
            type="index"
            label="序号"
            width="100"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{(pagination2.page - 1) * 10 + scope.$index + 1}}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="sbmc"
            label="商标名称"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="zch"
            label="注册号"
            align="center"
          ></el-table-column>
          <!-- <el-table-column
            prop="curstatus"
            label="商标状态"
            align="center"
          ></el-table-column> -->
        </el-table>
        <div class="pagination"><el-pagination
            layout="prev, pager, next"
            background
            :current-page.sync='pagination2.page'
            :total="pagination2.total"
            @current-change='brand'
          ></el-pagination></div>
      </el-dialog>
    </div>
    <div
      v-if="false"
      ref="panelRef3"
      class="basicInfo basicInfo1"
    >
      <p class="title"><span>作品著作权</span><span
          @click="checkMoreWorks"
          class="glqy"
        >查看更多信息>></span></p>
      <el-table
        :data="worksList"
        style="width: 100%"
        v-loading='loadingWorks'
        :header-cell-style="{background:'#f2f9fe'}"
      >
        <el-table-column
          type="index"
          label="序号"
          width="100"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="worksName"
          label="作品名称"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="registNo"
          label="登记号"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="registDate"
          label="登记时间"
          align="center"
        ></el-table-column>
      </el-table>
      <el-dialog
        title="查看更多作品著作权"
        :visible.sync="dialogVisibleWorks"
        width="50%"
        custom-class="dialog"
      >
        <el-table
          :data="worksMoreList"
          style="width: 100%"
          :header-cell-style="{background:'#f2f9fe'}"
        >
          <el-table-column
            type="index"
            label="序号"
            width="100"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{(paginationWorks.page - 1) * 10 + scope.$index + 1}}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="worksName"
            label="作品名称"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="registNo"
            label="登记号"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="registDate"
            label="登记时间"
            align="center"
          ></el-table-column>
        </el-table>
        <div class="pagination"><el-pagination
            layout="prev, pager, next"
            background
            :current-page.sync='paginationWorks.page'
            :total="paginationWorks.total"
            @current-change='works'
          ></el-pagination></div>
      </el-dialog>
    </div>
    <div
      ref="panelRef4"
      class="basicInfo basicInfo1"
    >
      <p class="title"><span>软件著作权</span><span
          @click="checkMoreCopyright"
          class="glqy"
        >查看更多信息>></span></p>
      <el-table
        :data="copyrightList"
        style="width: 100%"
        v-loading='loading3'
        :header-cell-style="{background:'#f2f9fe'}"
      >
        <el-table-column
          type="index"
          label="序号"
          width="100"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="name"
          label="软件名称"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="registerno"
          label="注册号"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="versionno"
          label="版本号"
          align="center"
        ></el-table-column>
      </el-table>
      <el-dialog
        title="查看更多软件著作权信息"
        :visible.sync="dialogVisible3"
        width="50%"
        custom-class="dialog"
      >
        <el-table
          :data="copyrightMoreList"
          style="width: 100%"
          :header-cell-style="{background:'#f2f9fe'}"
        >
          <el-table-column
            type="index"
            label="序号"
            width="100"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{(pagination3.page - 1) * 10 + scope.$index + 1}}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="name"
            label="软件名称"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="registerno"
            label="注册号"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="versionno"
            label="版本号"
            align="center"
          ></el-table-column>
        </el-table>
        <div class="pagination"><el-pagination
            layout="prev, pager, next"
            background
            :current-page.sync='pagination3.page'
            :total="pagination3.total"
            @current-change='copyright'
          ></el-pagination></div>
      </el-dialog>
    </div>
    <div
      v-if="false"
      ref="panelRef5"
      class="basicInfo basicInfo1"
    >
      <p class="title"><span>知识产权质押</span><span
          @click="checkMoreZscqzy"
          class="glqy"
        >查看更多信息>></span></p>
      <el-table
        :data="zscqzyDataList"
        style="width: 100%"
        v-loading='loadingZscqzy'
        :header-cell-style="{background:'#f2f9fe'}"
      >
        <el-table-column
          type="index"
          label="序号"
          width="100"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="mc"
          label="名称"
          show-overflow-tooltip
          align="center"
        ></el-table-column>
        <el-table-column
          prop="zscqdjzh"
          label="知识产权登记证号"
          show-overflow-tooltip
          align="center"
        ></el-table-column>
        <el-table-column
          prop="zl"
          label="种类"
          show-overflow-tooltip
          align="center"
        ></el-table-column>
        <el-table-column
          prop="zqrmc"
          label="质权人名称"
          show-overflow-tooltip
          align="center"
        ></el-table-column>
        <el-table-column
          prop="zt"
          label="状态"
          show-overflow-tooltip
          align="center"
        ></el-table-column>
        <el-table-column
          prop="gsrq"
          label="公示日期"
          align="center"
          show-overflow-tooltip
        ></el-table-column>
      </el-table>
      <el-dialog
        title="查看更多知识产权质押"
        :visible.sync="dialogVisibleZscqzy"
        width="60%"
        custom-class="dialog"
      >
        <el-table
          :data="zscqzyMoreList"
          style="width: 100%"
          :header-cell-style="{background:'#f2f9fe'}"
        >
          <el-table-column
            type="index"
            label="序号"
            width="100"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{(paginationZscqzy.page - 1) * 10 + scope.$index + 1}}</span>
            </template>
          </el-table-column>
          <el-table-column
          prop="mc"
          label="名称"
          show-overflow-tooltip
          align="center"
        ></el-table-column>
        <el-table-column
          prop="zscqdjzh"
          label="知识产权登记证号"
          show-overflow-tooltip
          align="center"
        ></el-table-column>
        <el-table-column
          prop="zl"
          label="种类"
          show-overflow-tooltip
          align="center"
        ></el-table-column>
        <el-table-column
          prop="zqrmc"
          label="质权人名称"
          show-overflow-tooltip
          align="center"
        ></el-table-column>
        <el-table-column
          prop="zt"
          label="状态"
          show-overflow-tooltip
          align="center"
        ></el-table-column>
        <el-table-column
          prop="gsrq"
          label="公示日期"
          align="center"
          show-overflow-tooltip
        ></el-table-column>
        </el-table>
        <div class="pagination"><el-pagination
            layout="prev, pager, next"
            background
            :current-page.sync='paginationZscqzy.page'
            :total="paginationZscqzy.total"
            @current-change='handelChangeZscqzy'
          ></el-pagination></div>
      </el-dialog>
    </div>

  </div>
</template>

<script>
import {
  getZlxxList,
  getSbxxList,
  getRjzzqList,
  getZpzzqList,
  getKjyf,
  getZscqInfo
} from '@/api/portay'
export default {
  props: ['comInfo', 'isTm'],
  data() {
    return {
      activeIndex: 'a',
      list: [
        { text: '科技研发信息', disabled: false },
        { text: '专利信息', disabled: false },
        { text: '商标信息', disabled: false },
        // { text: '作品著作权', disabled: false },
        { text: '软件著作权', disabled: false },
        // { text: '知识产权质押', disabled: false },
      ],
      dialogVisible1: false,
      dialogVisible2: false,
      dialogVisible3: false,
      dialogVisibleWorks: false,
      patentList: [],
      patentMoreList: [],
      pagination1: {
        page: 1,
        total: 0,
      },
      brandList: [],
      brandMoreList: [],
      paginationWorks: {
        page: 1,
        total: 0,
      },
      worksList: [],
      worksMoreList: [],
      pagination2: {
        page: 1,
        total: 0,
      },
      copyrightList: [],
      copyrightMoreList: [],
      pagination3: {
        page: 1,
        total: 0,
      },
      loading1: false,
      loading2: false,
      loading3: false,
      loadingWorks: false,
      loading4: false,
      dialogVisible4: false,
      pagination4: { page: 1, total: 0 },
      keyInfoData: [],
      keyInfoMoreData: [],
      /* 知识产权质押 */
      zscqzyDataList:[],
      zscqzyMoreList:[],
      loadingZscqzy: false,
      dialogVisibleZscqzy: false,
      paginationZscqzy: { page: 1, total: 0 },
    }
  },
  created() {},
  watch: {
    comInfo: {
      handler(newVal, oldVal) {
        if (newVal.shtyxydm) {
          this.getZlxxList()
          this.getSbxxList()
          this.getRjzzqList()
          //this.getWorksList()
          this.getKeyList() //科技研发信息
          //this.getZscqzyList() //知识产权质押
        }
      },
      deep: true,
      immediate: true,
    },
  },
  mounted() {},
  methods: {
    //科技研发信息
    getKeyList() {
      this.loading4 = true
      let index = this.list.findIndex((item) => item.text == '科技研发信息')
      getKjyf({
        TYSHXYDM: this.comInfo.shtyxydm,
        pageNum: 1,
        pageSize: 2,
      }).then((res) => {
        this.loading4 = false
        this.keyInfoData = res.data.records
        this.list[index].num = res.data.total
      })
    },
    //查看更多科技研发信息
    checkMorekey() {
      this.dialogVisible4 = true
      this.pagination4.page = 1
      getKjyf({
        TYSHXYDM: this.comInfo.shtyxydm,
        pageNum: 1,
        pageSize: 10,
      }).then((res) => {
        this.keyInfoMoreData = res.data.records
        this.pagination4.total = Number(res.data.total)
      })
    },
    //查看更多科技研发信息分页
    keyPagion(val) {
      this.pagination4.page = val
      getKjyf({
        TYSHXYDM: this.comInfo.shtyxydm,
        pageNum: val,
        pageSize: 10,
      }).then((res) => {
        this.keyInfoMoreData = res.data.records
      })
    },
    //专利信息
    getZlxxList() {
      this.loading1 = true
      let index = this.list.findIndex((item) => item.text == '专利信息')
      getZlxxList({
        shtyxydm: this.comInfo.shtyxydm,
        pageNum: 1,
        pageSize: 2,
      }).then((res) => {
        this.loading1 = false
        this.patentList = res.data.records
        this.list[index].num = res.data.total
      })
    },
    //查看更多专利信息
    checkMorePatent() {
      this.dialogVisible1 = true
      this.pagination1.page = 1
      getZlxxList({
        shtyxydm: this.comInfo.shtyxydm,
        pageNum: 1,
        pageSize: 10,
      }).then((res) => {
        this.patentMoreList = res.data.records
        this.pagination1.total = Number(res.data.total)
      })
    },
    //查看更多专利信息分页
    patent(val) {
      this.pagination1.page = val
      getZlxxList({
        shtyxydm: this.comInfo.shtyxydm,
        pageNum: val,
        pageSize: 10,
      }).then((res) => {
        this.patentMoreList = res.data.records
      })
    },
    //商标
    getSbxxList() {
      this.loading2 = true
      let index = this.list.findIndex((item) => item.text == '商标信息')
      getSbxxList({
        TYSHXYDM: this.comInfo.shtyxydm,
        pageNum: 1,
        pageSize: 2,
      }).then((res) => {
        this.loading2 = false
        this.brandList = res.data.records
        this.list[index].num = res.data.total
      })
    },
    //查看更多商标
    checkMoreBrand() {
      this.dialogVisible2 = true
      this.pagination2.page = 1
      getSbxxList({
        TYSHXYDM: this.comInfo.shtyxydm,
        pageNum: 1,
        pageSize: 10,
      }).then((res) => {
        this.brandMoreList = res.data.records
        this.pagination2.total = Number(res.data.total)
      })
    },
    //查看更多商标信息分页
    brand(val) {
      this.pagination2.page = val
      getSbxxList({
        TYSHXYDM: this.comInfo.shtyxydm,
        pageNum: val,
        pageSize: 10,
      }).then((res) => {
        this.brandMoreList = res.data.records
      })
    },
    //作品著作权
    getWorksList() {
      this.loadingWorks = true
      let index = this.list.findIndex((item) => item.text == '作品著作权')
      getZpzzqList({
        TYSHXYDM: this.comInfo.shtyxydm,
        pageNum: 1,
        pageSize: 2,
      }).then((res) => {
        this.loadingWorks = false
        this.worksList = res.data.records
        this.list[index].num = res.data.total
      })
    },
    //查看更多作品著作权
    checkMoreWorks() {
      this.dialogVisibleWorks = true
      this.paginationWorks.page = 1
      getZpzzqList({
        TYSHXYDM: this.comInfo.shtyxydm,
        pageNum: 1,
        pageSize: 10,
      }).then((res) => {
        this.worksMoreList = res.data.records
        this.paginationWorks.total = Number(res.data.total)
      })
    },
    //查看更多作品著作权分页
    works(val) {
      this.paginationWorks.page = val
      getZpzzqList({
        TYSHXYDM: this.comInfo.shtyxydm,
        pageNum: val,
        pageSize: 10,
      }).then((res) => {
        this.worksMoreList = res.data.records
      })
    },
    //软件著作权信息
    getRjzzqList() {
      this.loading3 = true
      let index = this.list.findIndex((item) => item.text == '软件著作权')
      getRjzzqList({
        shtyxydm: this.comInfo.shtyxydm,
        pageNum: 1,
        pageSize: 2,
      }).then((res) => {
        this.loading3 = false
        this.copyrightList = res.data.records
        this.list[index].num = res.data.total
      })
    },
    //查看更多软件著作权信息
    checkMoreCopyright() {
      this.dialogVisible3 = true
      this.pagination3.page = 1
      getRjzzqList({
        shtyxydm: this.comInfo.shtyxydm,
        pageNum: 1,
        pageSize: 10,
      }).then((res) => {
        this.copyrightMoreList = res.data.records
        this.pagination3.total = Number(res.data.total)
      })
    },
    //查看更多软件著作权信息分页
    copyright(val) {
      this.pagination3.page = val
      getRjzzqList({
        shtyxydm: this.comInfo.shtyxydm,
        pageNum: val,
        pageSize: 10,
      }).then((res) => {
        this.copyrightMoreList = res.data.records
      })
    },
    //知识产权质押
    getZscqzyList() {
      this.loadingZscqzy = true
      let index = this.list.findIndex((item) => item.text == '知识产权质押')
      getZscqInfo({
        TYSHXYDM: this.comInfo.shtyxydm,
        pageNum: 1,
        pageSize: 2,
      }).then((res) => {
        this.loadingZscqzy = false
        this.zscqzyDataList = res.data.records
        this.list[index].num = res.data.total
      })
    },
    //查看更多知识产权质押
    checkMoreZscqzy() {
      this.dialogVisibleZscqzy = true
      this.paginationZscqzy.page = 1
      getZscqInfo({
        TYSHXYDM: this.comInfo.shtyxydm,
        pageNum: 1,
        pageSize: 10,
      }).then((res) => {
        this.zscqzyMoreList = res.data.records
        this.paginationZscqzy.total = Number(res.data.total)
      })
    },
    //查看更多知识产权质押分页
    handelChangeZscqzy(val) {
      this.paginationZscqzy.page = val
      getZscqInfo({
        TYSHXYDM: this.comInfo.shtyxydm,
        pageNum: val,
        pageSize: 10,
      }).then((res) => {
        this.zscqzyMoreList = res.data.records
      })
    },
    // 点击导航栏，滚动条移动到内容所对应的位置
    goAssignBlock(el, speed, index) {
      el = 'panelRef1';
      this.activeIndex = index
      let windowH = window.innerHeight //浏览器窗口高度
      let h = this.$refs[el].offsetHeight //模块内容高度

      let t = this.$refs[el].offsetTop //模块相对于内容顶部的距离
      let top = t - (windowH - h) / 2 //需要滚动到的位置，若改为 t 则滚动到模块顶部位置，此处是滚动到模块相对于窗口垂直居中的位置
      let scrollTop =
        window.pageYOffset ||
        document.documentElement.scrollTop ||
        document.body.scrollTop //滚动条距离顶部高度
      let currentTop = scrollTop //默认滚动位置为当前滚动条位置，若改为0，则每次都会从顶部滚动到指定位置
      let requestId
      //采用requestAnimationFrame，平滑动画
      function step() {
        //判断让滚动条向上滚还是向下滚
        if (scrollTop < top) {
          if (currentTop <= top) {
            //   window.scrollTo(x,y) y为上下滚动位置
            window.scrollTo(0, currentTop)
            requestId = window.requestAnimationFrame(step)
          } else {
            window.cancelAnimationFrame(requestId)
          }
          //向下滚动
          currentTop += speed
        } else {
          if (top <= currentTop) {
            //注：此处 - speed 是解决居中时存在的问题，可自行设置或去掉
            window.scrollTo(0, currentTop - speed)
            requestId = window.requestAnimationFrame(step)
          } else {
            window.cancelAnimationFrame(requestId)
          }
          //向上滚动
          currentTop -= speed
        }
      }
      window.requestAnimationFrame(step)
    },
  },
}
</script>

<style scoped="scoped" lang="scss">
.containter {
  width: 100%;
  .step {
    ol.titt {
      height: 160px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-items: center;
      background-color: #fff;
      margin: 0;
      padding: 0;
      font-size: 14px;
      position: fixed;
      top: 350px;
      right: 24px;
      z-index: 999;
    }
    ol.titt .button {
      width: 150px;
      margin: 0;
    }
    ol.titt .button.cur {
      background-color: #5591f5;
      color: #fff;
    }
  }
  .basicInfo {
    background: #fff;
    border-radius: 10px;
    width: 100%;
    padding: 12px 174px 12px 24px;
    margin-top: 20px;
    .title {
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
    .chart {
      display: flex;
      justify-content: space-between;
      align-items: center;
      #trend,
      #type {
        width: 700px;
        height: 400px;

        border-radius: 4px;
        padding: 12px;
        box-shadow: 0 0 10px #e8eaef;
      }
    }
  }
}
.morexxfp {
  display: flex;
  align-items: center;
  margin-bottom: 24px;
  div {
    margin-right: 24px;
  }
}
.title {
  font-size: 18px;
  font-weight: 900;
}
.glqy {
  color: #4a8bf6;
  margin-left: 24px;
}
.glqy:hover {
  cursor: pointer;
}
.item {
  margin-top: 4px;
  margin-right: 16px;
}
</style>
<style>
.dialog {
  border-radius: 10px;
  padding-bottom: 50px;
}
.el-dialog {
  display: flex;
  flex-direction: column;
  margin: 0 !important;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /*height:600px;*/
  max-height: calc(100% - 200px);
  max-width: calc(100% - 30px);
}
.el-dialog .el-dialog__body {
  flex: 1;
  overflow: auto;
}
.pagination {
  width: 100%;
  margin-top: 10px;
  display: flex;
  justify-content: center;
}
</style>